React DevTools
https://ja.react.dev/learn/react-developer-tools
ブラウザで
コンポーネントツリー
を可視化し、各
React Component
の
Props
や
State
を確認できるブラウザ拡張機能
https://scrapbox.io/files/66da6952035359001d387233.png
検索バーから該当の Component を見つけ出すことも可能
クリックすると、選択した Component の Props と
React Hooks
が表示される
https://scrapbox.io/files/66da6a653bc036001c172410.png
Props や State の値を編集し、それによる変更の影響を確認することも可能
インストール（Chrome / Chronium）
https://chromewebstore.google.com/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi
から追加
#React